<template>
    <el-card class="box-card" style="width: 99%; height: 99%;">
        <div class="pharmaceutical-wrapper">
            <div class="left-wrapper">
                <div>
                    <TodayEquipmentInventory :data="instrumentInventory" />
                </div>
                <div style="margin-top: 30px;">
                    <YesterdayCnsume :data="instrumentConsume" />
                </div>
            </div>
            <div class="right-wrapper">
                <allCeutical :data="alldata" />
            </div>
        </div>
    </el-card>
</template>

<script setup lang="ts">
import TodayEquipmentInventory from './todayEquipmentInventory.vue'
import YesterdayCnsume from './yesterdayCnsume.vue'
import allCeutical from './allCeutical.vue'
import { infomationcenterdrugs } from '@/api/illnessBigData/illnessBigData'
import { onMounted, reactive, ref, onUpdated } from 'vue';

// 数据汇总
let data = reactive<any>([])
// 器械库存
let instrumentInventory = ref()
// 器械消耗占比
let instrumentConsume = reactive([])
//总消耗
let alldata = reactive([])

onMounted(async () => {
    await getData()
    console.log(data, 'sjsjjs');
    // 器械库存
    instrumentInventory.value = data.cursurplus
    // 器械消耗占比
    instrumentConsume = data.yesterdayChart
    console.log(data.weekChart.data);
    let res1 = data.weekChart.data
    let weeks = data.weekChart.type
    let arrays = [];
    for(let i = 0;i<7;i++){
        let obj = {}
        obj['State'] = weeks[i];
        res1.forEach(d => {
            obj[d.name] = d.data[i]
        });
        arrays.push(obj)

    }
    alldata=arrays
    // console.log(arrays);
    
    


})
// 发请求
const getData = async () => {
    let res = await infomationcenterdrugs()
    console.log(res);
    data = res.data
}



</script>

<style lang="scss" scoped>
.pharmaceutical-wrapper {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 900px;
    // background-color: red;

    .left-wrapper {
        width: 40%;
        height: 100%;
        // background-color: aqua;
    }

    .right-wrapper {
        // margin-top: 30px;
        padding: 150px;
        width: 50%;
        height: 100%;
        // background-color: #000;
    }
}
</style>